<!-- HTML5文件 -->
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8"/>
		<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">
		<title>Agile Lite</title>
		<link rel="stylesheet" href="../assets/agile/css/agile.layout.css">
		<link rel="stylesheet" href="../assets/third/weui/agile.weui.css">
		<link rel="stylesheet" href="http://weui.github.io/weui/weui.css">
	</head>
	<body>
		<div id="section_container">
			<section id="weui_index_section" data-role="section" class="active">
				<header class="comm-header">
				  	<h1 class="title">WeUI</h1>
				  	<a data-toggle="back" href="#" class="pull-right"><i class="weui_icon_cancel"></i></a>
				</header>
				<article data-role="article" id="weui_index_article" class="active" style="top:44px;bottom:0px;">
					<div class="scroller">
						<div class="weui_cells weui_cells_access global_navs">
		                    <a class="weui_cell js_cell" href="#weui_button_section" data-toggle="section">
		                        <span class="weui_cell_hd"><img data-source="http://weui.github.io/weui/images/icon_nav_button.png" class="icon_nav" alt=""></span>
		                        <div class="weui_cell_bd weui_cell_primary">
		                            <p>Button</p>
		                        </div>
		                        <div class="weui_cell_ft">
		                        </div>
		                    </a>
		                    <a class="weui_cell js_cell" href="#weui_cell_section" data-toggle="section">
		                        <span class="weui_cell_hd"><img data-source="http://weui.github.io/weui/images/icon_nav_cell.png" class="icon_nav" alt=""></span>
		                        <div class="weui_cell_bd weui_cell_primary">
		                            <p>Cell</p>
		                        </div>
		                        <div class="weui_cell_ft">
		                        </div>
		                    </a>
		                    <a class="weui_cell js_cell" href="#weui_toast_section" data-toggle="section">
		                        <span class="weui_cell_hd"><img data-source="http://weui.github.io/weui/images/icon_nav_toast.png" class="icon_nav" alt=""></span>
		                        <div class="weui_cell_bd weui_cell_primary">
		                            <p>Toast</p>
		                        </div>
		                        <div class="weui_cell_ft">
		                        </div>
		                    </a>
		                    <a class="weui_cell js_cell" href="#weui_dialog_section" data-toggle="section">
		                        <span class="weui_cell_hd"><img data-source="http://weui.github.io/weui/images/icon_nav_dialog.png" class="icon_nav" alt=""></span>
		                        <div class="weui_cell_bd weui_cell_primary">
		                            <p>Dialog</p>
		                        </div>
		                        <div class="weui_cell_ft">
		                        </div>
		                    </a>
		                    <a class="weui_cell js_cell" href="#weui_progress_section" data-toggle="section">
		                        <span class="weui_cell_hd"><img data-source="http://weui.github.io/weui/images/icon_nav_button.png" class="icon_nav" alt=""></span>
		                        <div class="weui_cell_bd weui_cell_primary">
		                            <p>Progress</p>
		                        </div>
		                        <div class="weui_cell_ft">
		                        </div>
		                    </a>
		                    <a class="weui_cell js_cell" href="#weui_msg_section" data-toggle="section">
		                        <span class="weui_cell_hd"><img data-source="http://weui.github.io/weui/images/icon_nav_msg.png" class="icon_nav" alt=""></span>
		                        <div class="weui_cell_bd weui_cell_primary">
		                            <p>Msg Page</p>
		                        </div>
		                        <div class="weui_cell_ft">
		                        </div>
		                    </a>
		                    <a class="weui_cell js_cell" href="#weui_article_section" data-toggle="section">
		                        <span class="weui_cell_hd"><img data-source="http://weui.github.io/weui/images/icon_nav_article.png" class="icon_nav" alt=""></span>
		                        <div class="weui_cell_bd weui_cell_primary">
		                            <p>Article Page</p>
		                        </div>
		                        <div class="weui_cell_ft">
		                        </div>
		                    </a>
		                    <a class="weui_cell js_cell" href="#weui_actionSheet_section" data-toggle="section">
		                        <span class="weui_cell_hd"><img data-source="http://weui.github.io/weui/images/icon_nav_actionSheet.png" class="icon_nav" alt=""></span>
		                        <div class="weui_cell_bd weui_cell_primary">
		                            <p>ActionSheet</p>
		                        </div>
		                        <div class="weui_cell_ft">
		                        </div>
		                    </a>
		                    <a class="weui_cell js_cell" href="#weui_icons_section" data-toggle="section">
		                        <span class="weui_cell_hd"><img data-source="http://weui.github.io/weui/images/icon_nav_icons.png" class="icon_nav" alt=""></span>
		                        <div class="weui_cell_bd weui_cell_primary">
		                            <p>Icons</p>
		                        </div>
		                        <div class="weui_cell_ft">
		                        </div>
		                    </a>
		                </div>
    				</div>
				</article>
			</section>
		</div>
		
		<!--- third --->
		<script src="../assets/third/jquery/jquery-2.1.3.min.js"></script>
		<script src="../assets/third/jquery/jquery.mobile.custom.min.js"></script>
		<script src="../assets/third/iscroll/iscroll-probe.js"></script>
		<script src="../assets/third/arttemplate/template-native.js"></script>
		<!-- agile -->
		<script type="text/javascript" src="../assets/agile/js/agile.js"></script>
<script type="text/javascript" src="../assets/bridge/exmobi.js"></script>
<script type="text/javascript" src="../assets/bridge/agile.exmobi.js"></script>		
		<!-- app -->
		<script type="text/javascript" src="../assets/app/js/app.js"></script>
		<script>
		$(document).on('sectionload', '#weui_toast_section', function(){
			$('#showToast').on(A.options.clickEvent, function () {
		        $('#toast').show();
		        setTimeout(function () {
		            $('#toast').hide();
		        }, 5000);
		    });
		    $('#showLoadingToast').on(A.options.clickEvent, function () {
		        $('#loadingToast').show();
		        setTimeout(function () {
		            $('#loadingToast').hide();
		        }, 5000);
		    });
		});
		
		$(document).on('sectionload', '#weui_dialog_section', function(){
			$('#showDialog1').on(A.options.clickEvent, function () {
		        $('#dialog1').show();
		        $('#dialog1').find('.weui_btn_dialog').on('click', function () {
		            $('#dialog1').hide();
		        });
		    });
		    $('#showDialog2').on(A.options.clickEvent, function () {
		        $('#dialog2').show();
		        $('#dialog2').find('.weui_btn_dialog').on('click', function () {
		            $('#dialog2').hide();
		        });
		    });
		});
		
		(function(){
			function hideActionSheet(weuiActionsheet, mask) {
		        weuiActionsheet.removeClass('weui_actionsheet_toggle');
		        mask.removeClass('weui_fade_toggle');
		        weuiActionsheet.on('transitionend', function () {
		            mask.hide();
		        }).on('webkitTransitionEnd', function () {
		            mask.hide();
		        })
		    }
		    
		    $(document).on('sectionload', '#weui_actionSheet_section', function(){
				$('#showActionSheet').on(A.options.clickEvent, function () {
			        var mask = $('#mask');
			        var weuiActionsheet = $('#weui_actionsheet');
			        weuiActionsheet.addClass('weui_actionsheet_toggle');
			        mask.show().addClass('weui_fade_toggle').click(function () {
			            hideActionSheet(weuiActionsheet, mask);
			        });
			        $('#actionsheet_cancel').click(function () {
			            hideActionSheet(weuiActionsheet, mask);
			        });
			        weuiActionsheet.unbind('transitionend').unbind('webkitTransitionEnd');
			        
			        return false;
			    });
			});
		    
		})();
			
		</script>
	</body>
</html>